{% extends 'base.html' %}

{% block title %}报表统计 - 维修管理系统{% endblock %}

{% block content %}
<h2>系统报表统计</h2>

<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin: 30px 0;">
    <!-- 工单统计 -->
    <div style="background: #e8f4f8; padding: 20px; border-radius: 8px; border-left: 4px solid #3498db;">
        <h3>工单统计</h3>
        <p><strong>总工单数:</strong> {{ ticket_stats.total }}</p>
        <p><strong>待处理:</strong> {{ ticket_stats.pending }}</p>
        <p><strong>处理中:</strong> {{ ticket_stats.in_progress }}</p>
        <p><strong>已完成:</strong> {{ ticket_stats.completed }}</p>
        <p><strong>已关闭:</strong> {{ ticket_stats.closed }}</p>
        <p><strong>最近30天:</strong> {{ ticket_stats.recent }}</p>
    </div>

    <!-- 设备统计 -->
    <div style="background: #f8e8e8; padding: 20px; border-radius: 8px; border-left: 4px solid #e74c3c;">
        <h3>设备统计</h3>
        <p><strong>总设备数:</strong> {{ asset_stats.total }}</p>
        <p><strong>正常:</strong> {{ asset_stats.active }}</p>
        <p><strong>维修中:</strong> {{ asset_stats.maintenance }}</p>
        <p><strong>已报废:</strong> {{ asset_stats.retired }}</p>
    </div>

    <!-- 优先级统计 -->
    <div style="background: #f8f4e8; padding: 20px; border-radius: 8px; border-left: 4px solid #f39c12;">
        <h3>优先级统计</h3>
        <p><strong>高优先级:</strong> {{ priority_stats.high }}</p>
        <p><strong>中优先级:</strong> {{ priority_stats.medium }}</p>
        <p><strong>低优先级:</strong> {{ priority_stats.low }}</p>
    </div>
</div>

<div style="background: #f9f9f9; padding: 20px; border-radius: 8px; margin: 20px 0;">
    <h3>统计说明</h3>
    <ul>
        <li>数据统计时间范围: {{ thirty_days_ago|date:"Y年m月d日" }} 至今</li>
        <li>工单状态说明: 待处理 → 处理中 → 已完成 → 已关闭</li>
        <li>设备状态说明: 正常 / 维修中 / 已报废 / 停用</li>
        <li>优先级说明: 高 / 中 / 低</li>
    </ul>
</div>

<div style="text-align: center; margin-top: 30px;">
    <a href="/admin/" class="btn">查看详细数据</a>
    <a href="{% url 'dashboard' %}" class="btn">返回仪表板</a>
</div>
{% endblock %}
